<template>
  <a-config-provider :locale="locale">
    <div id="app">
      <router-view/>
    </div>
  </a-config-provider>
</template>
<script>
  import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN'
  import enquireScreen from '@/utils/device'

  export default {
    data() {
      return {
        locale: zhCN,
      }
    },
    created() {
      this.$store.dispatch('ToggleTheme', "dark");
      let that = this
      enquireScreen(deviceType => {
        // tablet
        if (deviceType === 0) {
          that.$store.commit('TOGGLE_DEVICE', 'mobile')
          that.$store.dispatch('setSidebar', false)
        }
        // mobile
        else if (deviceType === 1) {
          that.$store.commit('TOGGLE_DEVICE', 'mobile')
          that.$store.dispatch('setSidebar', false)
        } else {
          that.$store.commit('TOGGLE_DEVICE', 'desktop')
          that.$store.dispatch('setSidebar', true)
        }

      })
    }
  }
</script>
<style>
  #app {
    height: 100%;
  }

  /*单独的样式*/
  /** {*/
  /*  margin: 0px;*/
  /*  padding: 0px;*/
  /*  box-sizing: border-box;*/
  /*  text-decoration: none;*/

  /*}*/

  /*p {*/
  /*  margin: 0px;*/
  /*}*/

  /*body {*/
  /*  background-color: rgba(242, 242, 242, 1) !important;*/
  /*}*/

  /*.group {*/

  /*.ant-tabs-bar {*/
  /*  background-color: #fff !important;*/
  /*  padding-left: 24px !important;*/
  /*}*/

  .ant-tabs-nav-container {
    line-height: 3.5 !important;
  }

  .ant-tabs-tab-active {
    color: #000 !important;
    font-weight: 600 !important;
  }

  .ant-tabs-tab {
    font-size: 15px !important;
  }

  .ant-tabs-ink-bar {
    background-color: #3e3d3d !important;
    height: 2px !important;
  }

  .ant-tabs-nav .ant-tabs-tab:hover {
    color: #3e3d3d !important;
    font-weight: 500 !important;
  }

  .ant-btn-primary {
    background-color: #4c4c4c !important;
    font-size: 14px !important;
    color: #FFEC70 !important;
    border-color: #4c4c4c !important;
  }

  .ant-input:hover {
    border-color: #000 !important;
    border-right-width: 1px !important;
  }

  /*.ant-select-selection:hover {*/
  /*  border-color: #000 !important;*/
  /*  border-right-width: 1px !important;*/
  /*}*/

  /*.ant-table {*/
  /*  color: rgba(0, 0, 0, 0.65) !important;*/
  /*}*/

  /*.ant-table-thead > tr > th {*/
  /*  background: #4c4c4c !important;*/
  /*  color: #FFEC70 !important;*/
  /*  text-align: center !important;*/
  /*  border-right: 1px solid #ccc;*/
  /*}*/

  /*.ant-table-tbody > tr > td {*/
  /*  text-align: center !important;*/
  /*  border-bottom: none !important;*/
  /*}*/

  /*.ant-table-thead > tr.ant-table-row-hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,*/
  /*.ant-table-tbody > tr.ant-table-row-hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,*/
  /*.ant-table-thead > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,*/
  /*.ant-table-tbody > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td {*/
  /*  background-color: rgb(204, 204, 204) !important;*/
  /*  cursor: pointer;*/
  /*}*/

  /*.ant-pagination-item-active:focus a,*/
  /*.ant-pagination-item-active:hover a {*/
  /*  color: #FFEC70 !important;*/
  /*}*/

  /*.ant-pagination-item-active {*/
  /*  color: #FFEC70 !important;*/
  /*  border-color: #FFEC70 !important;*/
  /*  background-color: #FFEC70 !important;*/
  /*}*/

  /*.ant-pagination-item-active a {*/
  /*  color: rgba(0, 0, 0, 0.647) !important;*/
  /*}*/

  /*.ant-calendar-picker:focus .ant-calendar-picker-input:not(.ant-input-disabled) {*/
  /*  box-shadow: 0 0 0 2px rgba(76, 76, 76, 0.2) !important;*/
  /*  border-color: #4c4c4c !important;*/
  /*}*/

  /*.ant-select-focused .ant-select-selection,*/
  /*.ant-select-selection:focus,*/
  /*.ant-select-selection:active {*/
  /*  box-shadow: 0 0 0 2px rgba(76, 76, 76, 0.2) !important;*/
  /*  border-color: #4c4c4c !important;*/
  /*}*/

  /*.ant-input:focus {*/
  /*  box-shadow: 0 0 0 2px rgba(76, 76, 76, 0.2) !important;*/
  /*  border-color: #4c4c4c !important;*/
  /*}*/

  /*.table-css .ant-table-thead > tr > th {*/
  /*  background: rgba(249, 249, 249, 1) !important;*/
  /*  color: rgb(68, 68, 68) !important;*/
  /*  text-align: center !important;*/
  /*  border-right: 1px solid #fff;*/
  /*  font-size: 15px !important;*/
  /*}*/

  /*.table-css .ant-table-tbody > tr > td {*/
  /*  font-size: 13px !important;*/
  /*  color: #333 !important;*/
  /*}*/

  /*.ant-select-dropdown-menu-item:hover:not(.ant-select-dropdown-menu-item-disabled) {*/
  /*  background-color: #f0f0f0 !important;*/
  /*}*/

  /*.ant-select-dropdown-menu-item-active:not(.ant-select-dropdown-menu-item-disabled) {*/
  /*  background-color: #f0f0f0 !important;*/
  /*}*/

  /*.address {*/
  /*  height: 50px;*/
  /*  display: flex;*/
  /*  align-items: center;*/
  /*  border-bottom: 1px solid #e9e9e9;*/
  /*  background-color: #fff;*/

  /*&*/
  /*> div {*/
  /*  width: 80%;*/
  /*  margin: 0 auto;*/
  /*  display: flex;*/
  /*  align-items: center;*/

  /*p {*/
  /*  font-weight: 400;*/
  /*  font-style: normal;*/
  /*  color: #A8A8A8;*/
  /*  font-size: 13px;*/
  /*  margin: 0px;*/
  /*}*/

  /*.link {*/
  /*  padding-left: 15px;*/
  /*  font-size: 14px;*/
  /*  color: #4C4C4C;*/
  /*  text-align: left;*/
  /*}*/

  /*}*/
  /*}*/

  /*.ant-input {*/
  /*  height: 38px !important;*/
  /*}*/

  /*.ant-select-selection--single {*/
  /*  height: 38px !important;*/
  /*}*/

  /*.ant-select-selection__rendered {*/
  /*  line-height: 38px !important;*/
  /*}*/

  /*.ant-btn {*/
  /*  height: 38px !important;*/
  /*}*/

  /*.ant-btn:hover, .ant-btn:focus {*/
  /*  color: #FFEC70 !important;*/
  /*  background-color: #4c4c4c !important;*/
  /*  border-color: #4c4c4c !important;*/
  /*}*/

  /*.ant-btn-danger {*/
  /*  background-color: #4c4c4c !important;*/
  /*  border-color: #4c4c4c !important;*/
  /*}*/

  /*.ant-checkbox-checked .ant-checkbox-inner {*/
  /*  background-color: #4c4c4c !important;*/
  /*  border-color: #4c4c4c !important;*/
  /*}*/

  /*.ant-checkbox-wrapper:hover .ant-checkbox-inner, .ant-checkbox:hover .ant-checkbox-inner, .ant-checkbox-input:focus + .ant-checkbox-inner {*/

  /*  border-color: #4c4c4c !important;*/
  /*}*/
</style>